<template>
	<div class="notice_box">
        <div class="form_box">
            <div class="box">
                <p class="name">公司类型</p>
                <div class="label">
                    <p 
                        v-for="(item,index) in companyTypeList" 
                        :key="index"
                        :class="{ on: selectedValues.companyType === item.value }"
                        @click="selectItem('companyType', item.value)"
                    >{{item.label}}</p>
                </div>
            </div>
            <div class="box">
                <p class="name">公司年限</p>
                <div class="label">
                    <p 
                        v-for="(item,index) in companyYearList" 
                        :key="index"
                        :class="{ on: selectedValues.year === item.value }"
                        @click="selectItem('year', item.value)"
                    >{{item.label}}</p>
                </div>
            </div>
            <div class="box">
                <p class="name">实缴状态</p>
                <div class="label">
                    <p 
                        v-for="(item,index) in jfList" 
                        :key="index"
                        :class="{ on: selectedValues.capital === item.value }"
                        @click="selectItem('capital', item.value)"
                    >{{item.label}}</p>
                </div>
            </div>
            <div class="box">
                <p class="name">注册资本</p>
                <div class="label">
                    <p 
                        v-for="(item,index) in capitalList" 
                        :key="index"
                        :class="{ on: selectedValues.taxQuota === item.value }"
                        @click="selectItem('taxQuota', item.value)"
                    >{{item.label}}</p>
                </div>
            </div>
            <p class="line">税务情况</p>
            <div class="box">
                <div class="label">
                    <p 
                        v-for="(item,index) in swList" 
                        :key="index"
                        :class="{ on: selectedValues.taxationState === item.value }"
                        @click="selectItem('taxationState', item.value)"
                    >{{item.label}}</p>
                </div>
            </div>
            <p class="line">银行账户</p>
            <div class="box">
                <div class="label">
                    <p 
                        v-for="(item,index) in bankList" 
                        :key="index"
                        :class="{ on: selectedValues.bankAccount === item.value }"
                        @click="selectItem('bankAccount', item.value)"
                    >{{item.label}}</p>
                </div>
            </div>
            <!-- <div class="box">
                <p class="name">资质许可（含高企、认证）</p>
                <div class="change" @click="cityShow = true">
					<p>请选择</p>
					<u-icon name="arrow-right" color="#A6A6A6" size="18"></u-icon>
				</div>
            </div> -->
            <div class="box">
                <p class="name">商标</p>
                <div class="label">
                    <p 
                        v-for="(item,index) in sbList" 
                        :key="index"
                        :class="{ on: selectedValues.trademark === item.value }"
                        @click="selectItem('trademark', item.value)"
                    >{{item.label}}</p>
                </div>
            </div>
            <div class="box">
                <p class="name">专利</p>
                <div class="label">
                    <p 
                        v-for="(item,index) in zlList" 
                        :key="index"
                        :class="{ on: selectedValues.patent === item.value }"
                        @click="selectItem('patent', item.value)"
                    >{{item.label}}</p>
                </div>
            </div>
            <div class="box">
                <p class="name">软著</p>
                <div class="label">
                    <p 
                        v-for="(item,index) in rzList" 
                        :key="index"
                        :class="{ on: selectedValues.softWorks === item.value }"
                        @click="selectItem('softWorks', item.value)"
                    >{{item.label}}</p>
                </div>
            </div>
            <div class="box">
                <p class="name">车牌指标</p>
                <div class="label">
                    <p 
                        v-for="(item,index) in carList" 
                        :key="index"
                        :class="{ on: selectedValues.licensePlate === item.value }"
                        @click="selectItem('licensePlate', item.value)"
                    >{{item.label}}</p>
                </div>
            </div>
            <div class="box">
                <p class="name">社保缴纳记录</p>
                <div class="label">
                    <p 
                        v-for="(item,index) in socialList" 
                        :key="index"
                        :class="{ on: selectedValues.socialSecurity === item.value }"
                        @click="selectItem('socialSecurity', item.value)"
                    >{{item.label}}</p>
                </div>
            </div>
            <div class="box">
                <p class="name">股东背景</p>
                <div class="label">
                    <p 
                        v-for="(item,index) in gdList" 
                        :key="index"
                        :class="{ on: selectedValues.shareholder === item.value }"
                        @click="selectItem('shareholder', item.value)"
                    >{{item.label}}</p>
                </div>
            </div>
            <div class="box">
                <p class="name">招投标业绩</p>
                <div class="label">
                    <p 
                        v-for="(item,index) in tbList" 
                        :key="index"
                        :class="{ on: selectedValues.bidPerformance === item.value }"
                        @click="selectItem('bidPerformance', item.value)"
                    >{{item.label}}</p>
                </div>
            </div>
            <div class="anniu_box">
                <p @click="reset">重置</p>
                <p @click="submit">确定</p>
            </div>
        </div>
    </div>
</template>

<script>
    import { mapState,mapActions } from 'vuex'
	export default {
        options: {
            styleIsolation: 'shared'
        },
		data() {
			return {
                companyTypeList:[
                    {label: '普通公司',value:'0'},
                    {label: '国家局公司',value:'1'},
                    {label: '上市公司',value:'2'},
                ],
                companyYearList:[
                    {label: '1年以下',value:'0'},
                    {label: '1年及以上',value:'1'},
                    {label: '2年及以上',value:'2'},
                    {label: '3年及以上',value:'3'},
                    {label: '5年及以上',value:'4'},
                    {label: '10年及以上',value:'5'},
                ],
                jfList:[
                    {label: '已实缴',value:'0'},
                    {label: '未实缴',value:'1'},
                ],
                capitalList:[
                    {label: '10万以下',value:'0'},
                    {label: '10-50万',value:'1'},
                    {label: '50-100万',value:'2'},
                    {label: '100-500万',value:'3'},
                    {label: '500-1000万',value:'4'},
                    {label: '1000万以上',value:'5'},
                ],
                swList:[
                    {label: '未登记',value:'0'},
                    {label: '小规模',value:'1'},
                    {label: '一般纳税人',value:'2'},
                ],
                bankList:[
                    {label: '未开户',value:'0'},
                    {label: '已开户',value:'1'},
                ],
                sbList:[
                    {label: '无商标',value:'0'},
                    {label: '有商标',value:'1'},
                ],
                zlList:[
                    {label: '无专利',value:'0'},
                    {label: '有专利',value:'1'},
                ],
                rzList:[
                    {label: '无软著',value:'0'},
                    {label: '有软著',value:'1'},
                ],
                carList:[
                    {label: '无车牌指标',value:'0'},
                    {label: '有车牌指标',value:'1'},
                ],
                socialList:[
                    {label: '无缴纳记录',value:'0'},
                    {label: '有缴纳记录',value:'1'},
                ],
                gdList:[
                    {label: '自然人',value:'0'},
                    {label: '国央企',value:'1'},
                    {label: '外资',value:'2'},
                ],
                tbList:[
                    {label: '无',value:'0'},
                    {label: '有',value:'1'},
                ],
                param:{
                    companyType:''
                },
                selectedValues: {
                    companyType:'',// 公司类型
                    year:'',// 公司年限
                    taxQuota:'',//注册资本
                    capital:'',// 实缴状态
                    taxationState:'',//税务情况
                    bankAccount:'',// 银行账户
                    trademark:'',// 商标
                    patent: '',// 专利
                    softWorks: '',// 软著
                    licensePlate: '',// 车牌指标
                    socialSecurity: '',// 社保缴纳记录
                    shareholder: '',// 股东背景
                    bidPerformance: ''// 招投标业绩
                }
			}
		},
        computed: {
			...mapState({
				userId: state => state.user.userId,
				token: state => state.user.token,
				status:state => state.user.status,
			})
		},
		methods: {

            // 重置
            reset(){
                this.selectedValues = {
                    companyType:'',
                    year:'',
                    taxQuota:'',
                    capital:'',
                    taxationState:'',
                    bankAccount:'',
                    trademark:'',
                    patent: '',
                    softWorks: '',
                    licensePlate: '',
                    socialSecurity: '',
                    shareholder: '',
                    bidPerformance: ''
                }
                this.$emit('close',this.selectedValues)
            },

            // 确定
            submit(){
                console.log(this.selectedValues)
                this.$emit('close',this.selectedValues)
            },

            selectItem(listName, value) {
                this.selectedValues[listName] = value;
            },
			
            close(){
                this.$emit('close')
            },

            toGs(){
                uni.navigateTo({
                    url: '/pages/company/payGs/index'
                });
            },

            toGt(){
                uni.navigateTo({
                    url: '/pages/company/payGt/index'
                });
            },

            toDz(){
                uni.navigateTo({
                    url: '/pages/company/payDz/index'
                });
            }
		},
        mounted(){
            console.log('111')
        },
        onLoad() {
		},
		onShow(){
            console.log('222')
        },
        // onShareAppMessage() {
		// 	return {
		// 		title: '免费用万人接单群',
		// 		path: `/pages/index/index?shareUserId=${this.userId}`
		// 	}
		// },
	}
</script>

<style lang="scss" scoped>
    .form_box{
        width: 600rpx;
        padding-top:30rpx;
        height: 100vh;
        overflow: auto;
        .box{
            padding:0 30rpx;
            .name{
                font-size:28rpx;
                color:#333;
                font-weight: 500;
            }
            .label{
                display: flex;
                flex-wrap:wrap;
                margin-top:20rpx;
                p{
                    padding:0 10rpx;
                    height: 48rpx;
                    line-height: 48rpx;
                    border-radius: 4rpx;
                    background: #f3eeee;
                    color:#a09c9c;
                    font-size: 24rpx;
                    margin-right:30rpx;
                    margin-bottom:30rpx;
                    &.on{
                        background: #23AC39;
                        color:#fff;
                    }
                }
            }
            .change{
                flex: 1;
                font-size: 26rpx;
                display: flex;
                justify-content: space-between;
                border:1px solid #eee;
                padding:15rpx;
                border-radius: 10rpx;
                margin:15rpx 0 30rpx 0;
            }
        }
        .line{
            padding:10rpx 30rpx;
            background: #f3eeee;
            font-size:28rpx;
            font-weight: 500;
        }
        .anniu_box{
            display: flex;
            justify-content: space-between;
            padding:0 50rpx 50rpx 50rpx;
            p{
                width: 46%;
                height: 70rpx;
                line-height: 70rpx;
                border:1px solid transparent;
                text-align: center;
                color:#fff;
                font-size:26rpx;
                background: #23AC39;
                border-radius: 100rpx;
                &:first-child{
                    background: none;
                    border-color: #23AC39;
                    color:#23AC39;
                }
            }
        }
    }
</style>
